<template>
  <div class="grjbxx">
    <p>创建时间：{{ info.fillDate | time }}</p>
    <p style="float: right; margin-top: -20px" v-if="false">
      <el-button
        size="small"
        style="background-color: #fff; color: rgb(0, 146, 254)"
        type="primary"
        plain
        >修改</el-button
      >
      <el-button
        size="small"
        style="background-color: #fff; color: rgb(0, 146, 254)"
        type="primary"
        plain
        >预览</el-button
      >
      <el-button
        size="small"
        style="background-color: #fff; color: rgb(0, 146, 254)"
        type="primary"
        plain
        >下载</el-button
      >
    </p>
    <p>最近更新时间：--</p>
    <p style="text-align: center; margin-top: 15px">
      <span style="font-weight: 700; font-size: 28px; color: #000"
        >个人基本信息表</span
      >
    </p>
    <p style="font-weight: 700; font-size: 20px; color: #000">基础信息</p>
    <table class="tab_sty_33" cellspacing="0" style="width: 100%">
      <tr>
        <th>姓名</th>
        <td>{{ info.residentName }}</td>
        <th>性别</th>
        <td>{{ info.gender | six}}</td>
        <th>出生日期</th>
        <td>{{ info.dataBirth | time }}</td>
        <th>证件类型</th>
        <td>{{ info.certificateType | id_type }}</td>
        <th>证件号码</th>
        <td>{{ info.idCard }}</td>
        <th>工作单位</th>
        <td>{{ info.workUnit }}</td>
        <th>本人电话</th>
        <td>{{ info.telephone }}</td>
        <th>联系人姓名</th>
        <td>{{ info.contactName }}</td>
        <th>联系人电话</th>
        <td>{{ info.contactPhone }}</td>
        <th>常住类型</th>
        <td>{{ info.usualType | usualType}}</td>
        <th>民族</th>
        <td>{{ info.national |minzu}}</td>
        <th>血型</th>
        <td>{{ info.bloodType |bloodType }}</td>
        <th>RH</th>
        <td>{{ info.rhRegative| rhRegative }}</td>
        <th>文化程度</th>
        <td>{{ info.education | education }}</td>
        <th>职业</th>
        <td>{{ info.duty | duty }}</td>
        <th>婚姻状况</th>
        <td>{{ info.maritalStatus | maritalStatus }}</td>
        <th>医疗费用支付方式</th>
        <td style="width: 53%">{{ info.payType | payType }}</td>
        <th>药物过敏史</th>
        <td style="width: 86%">{{ info.medicineAllergy | gms}}</td>
        <th>暴露史</th>
        <td style="width: 86%">{{ info.exposureHistory | bls}}</td>
      </tr>
    </table>
    <p style="font-weight: 700; font-size: 20px; color: #000; margin-top: 15px">
      既往史
    </p>
    <table class="tab_sty" cellspacing="0" style="width: 100%">
      <tr>
        <th>疾病</th>
        <td>-</td>
        <th>手术</th>
        <td>-</td>
        <th>外伤</th>
        <td>-</td>
        <th>输血</th>
        <td>-</td>
      </tr>
    </table>
    <p style="font-weight: 700; font-size: 20px; color: #000; margin-top: 15px">
      家族史
    </p>
    <table class="tab_sty" cellspacing="0" style="width: 100%">
      <tr>
        <th>父亲</th>
        <td>-</td>
        <th>母亲</th>
        <td>-</td>
        <th>兄弟姐妹</th>
        <td>-</td>
        <th>子女</th>
        <td>-</td>
        <th>遗传史</th>
        <td>-</td>
        <th>残疾情况</th>
        <td>-</td>
      </tr>
    </table>
    <p style="font-weight: 700; font-size: 20px; color: #000; margin-top: 15px">
      生活环境
    </p>
    <table class="tab_sty" cellspacing="0" style="width: 100%">
      <tr>
        <th>厨房排风设施</th>
        <td>-</td>
        <th>燃料类型</th>
        <td>-</td>
        <th>饮水</th>
        <td>-</td>
        <th>厕所</th>
        <td>-</td>
        <th>畜禽栏</th>
        <td style="width: 85%">-</td>
      </tr>
    </table>
  </div>
</template>
  
  <script>
export default {
  data() {
    return {
      info: {},
      options: [
        {
          value: "测试",
          label: "测试",
        },
      ],
      pickerOptions: {
        
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
        ],
      },
      value2: "",
      档案号: "530721-205-105-00293",
    };
  },
  mounted() {
    this.getdata();
  },
  methods: {
    getdata() {
      var data = {
        idNo: localStorage.getItem("idCard"),
      };
      this.$post("/resident/list?idNo=" + data.idNo).then((res) => {
        this.info = res.data[0];
      });
    },
  },
  filters: {
    time(val) {
      if (val == null || val == "") {
        return "";
      } else {
        let d = new Date(val); // val 为表格内取到的后台时间
        let month =
          d.getMonth() + 1 < 10 ? "0" + (d.getMonth() + 1) : d.getMonth() + 1;
        let day = d.getDate() < 10 ? "0" + d.getDate() : d.getDate();
        let hours = d.getHours() < 10 ? "0" + d.getHours() : d.getHours();
        let min = d.getMinutes() < 10 ? "0" + d.getMinutes() : d.getMinutes();
        let sec = d.getSeconds() < 10 ? "0" + d.getSeconds() : d.getSeconds();
        let times =
          d.getFullYear() +
          "-" +
          month +
          "-" +
          day +
          " " +
          hours +
          ":" +
          min +
          ":" +
          sec;
        return times;
      }
    },
    six(val) {
      var six = "";
      if (val == 1) {
        six = "男";
        return six;
      }
      if (val == 2) {
        six = "女";
        return six;
      } else {
        six = "未知";
        return six;
      }
    },
    status_to(val) {
      var status_to = "";
      if (val == 0) {
        status_to = "正常";
        return status_to;
      }
      if (val == 1) {
        status_to = "归档";
        return status_to;
      }
    },
    groupType_to(val) {
      var array = val.split(",");
      var str = [
        {
          id:1,
          name:'普通居民'
        },
        {
          id:2,
          name:'0-6岁儿童'
        },
        {
          id:4,
          name:'孕产妇'
        },
        {
          id:8,
          name:'65岁及以上老年人'
        },
        {
          id:16,
          name:'高血压患者'
        },
        {
          id:32,
          name:'2型糖尿病患者'
        },
        {
          id:64,
          name:'严重精神障碍患者'
        },
        {
          id:128,
          name:'肺结核患者'
        },
      ]
      var newArry = []
      for(var i in array){
        for(var j in str){
          if(array[i] == str[j].id){
            newArry.push(str[j].name)
          }
        }
      }
      return newArry.toString()
    },
    id_type(val){
      var id_type = ''
      if(val == 1){
        id_type = '身份证'
        return id_type
      }
      if(val == 2){
        id_type = '护照'
        return id_type
      }
      if(val == 3){
        id_type = '出生证'
        return id_type
      }
    },
    minzu(val){
      var mz = ''
      if(val == 1){
        mz = '汉族'
        return mz
      }
      if(val == 2){
        mz = '苗族'
        return mz
      }
      if(val == 3){
        mz = '回族'
        return mz
      }
      if(val == 4){
        mz = '壮族'
        return mz
      }
      if(val == 5){
        mz = '满族'
        return mz
      }
      if(val == 6){
        mz = '白族'
        return mz
      }
      if(val == 7){
        mz = '蒙古族'
        return mz
      }
      if(val == 8){
        mz = '维吾尔族'
        return mz
      }
      if(val == 9){
        mz = '土家族'
        return mz
      }
      if(val == 10){
        mz = '傣族'
        return mz
      }
      if(val == 11){
        mz = '彝族'
        return mz
      }
      if(val == 12){
        mz = '藏族'
        return mz
      }
      if(val == 13){
        mz = '黎族'
        return mz
      }
      if(val == 14){
        mz = '怒族'
        return mz
      }
      if(val == 15){
        mz = '景颇族'
        return mz
      }
      if(val == 16){
        mz = '朝鲜族'
        return mz
      }
      if(val == 17){
        mz = '土族'
        return mz
      }
      if(val == 18){
        mz = '门巴族'
        return mz
      }
      if(val == 19){
        mz = '水族'
        return mz
      }
      if(val == 20){
        mz = '毛南族'
        return mz
      }
      if(val == 21){
        mz = '乌孜别克族'
        return mz
      }
      if(val == 22){
        mz = '布依族'
        return mz
      }
      if(val == 23){
        mz = '布朗族'
        return mz
      }
      if(val == 24){
        mz = '东乡族'
        return mz
      }
      if(val == 25){
        mz = '仡佬族'
        return mz
      }
      if(val == 26){
        mz = '仫佬族'
        return mz
      }
      if(val == 27){
        mz = '达斡尔族'
        return mz
      }
      if(val == 28){
        mz = '佤族'
        return mz
      }
      if(val == 29){
        mz = '羌族'
        return mz
      }
      if(val == 30){
        mz = '阿昌族'
        return mz
      }
      if(val == 31){
        mz = '纳西族'
        return mz
      }
      if(val == 32){
        mz = '拉祜族'
        return mz
      }
      if(val == 33){
        mz = '侗族'
        return mz
      }
      if(val == 34){
        mz = '京族'
        return mz
      }
      if(val == 35){
        mz = '柯尔克孜族'
        return mz
      }
      if(val == 36){
        mz = '哈尼族'
        return mz
      }
      if(val == 37){
        mz = '哈萨克族'
        return mz
      }
      if(val == 38){
        mz = '保安族'
        return mz
      }
      if(val == 39){
        mz = '俄罗斯族'
        return mz
      }
      if(val == 40){
        mz = '独龙族'
        return mz
      }
      if(val == 41){
        mz = '珞巴族'
        return mz
      }
      if(val == 42){
        mz = '高山族'
        return mz
      }
      if(val == 43){
        mz = '基诺族'
        return mz
      }
      if(val == 44){
        mz = '鄂伦春族'
        return mz
      }
      if(val == 45){
        mz = '鄂温克族'
        return mz
      }
      if(val == 46){
        mz = '塔吉克族'
        return mz
      }
      if(val == 47){
        mz = '塔塔尔族'
        return mz
      }
      if(val == 48){
        mz = '傈僳族'
        return mz
      }
      if(val == 49){
        mz = '畲族'
        return mz
      }
      if(val == 50){
        mz = '普米族'
        return mz
      }
      if(val == 51){
        mz = '裕固族'
        return mz
      }
      if(val == 52){
        mz = '锡伯族'
        return mz
      }
      if(val == 53){
        mz = '瑶族'
        return mz
      }
      if(val == 54){
        mz = '赫哲族'
        return mz
      }
      if(val == 55){
        mz = '撒拉族'
        return mz
      }
      if(val == 56){
        mz = '德昂族'
        return mz
      }
      if(val == 57){
        mz = '果敢族'
        return mz
      }
      if(val == 58){
        mz = '摩梭人'
        return mz
      }
      if(val == 59){
        mz = '穿青人族'
        return mz
      }
      if(val == 60){
        mz = '其他民族'
        return mz
      }
    },
    gms(val){
      var gms = ''
      if(val == 1){
        gms = '无'
        return gms
      }
    },
    bls(val){
      var gms = ''
      if(val == 1){
        gms = '无'
        return gms
      }
    },
    usualType(val){
      var gms = ''
      if(val == 0){
        gms = '其他'
        return gms
      }
      if(val == 1){
        gms = '户籍'
        return gms
      }
      if(val == 2){
        gms = '非户籍'
        return gms
      }
    },
    bloodType(val){
      var gms = ''
      if(val == 1){
        gms = 'A型'
        return gms
      }
      if(val == 2){
        gms = 'B型'
        return gms
      }
      if(val == 3){
        gms = 'O型'
        return gms
      }
      if(val == 4){
        gms = 'AB型'
        return gms
      }
      if(val == 5){
        gms = '不详'
        return gms
      }
    },
    rhRegative(val){
      var gms = ''
      if(val == 1){
        gms = 'Rh阴性'
        return gms
      }
      if(val == 2){
        gms = 'Rh阳性'
        return gms
      }
      if(val == 3){
        gms = '不详'
        return gms
      }
      if(val == 4){
        gms = '未查'
        return gms
      }
    },
    education(val){
      var gms = ''
      if(val == 1){
        gms = '研究生'
        return gms
      }
      if(val == 2){
        gms = '大学本科'
        return gms
      }
      if(val == 3){
        gms = '大学专科和专科学院'
        return gms
      }
      if(val == 4){
        gms = '中等专业学校'
        return gms
      }
      if(val == 5){
        gms = '技工学校'
        return gms
      }
      if(val == 6){
        gms = '高中'
        return gms
      }
      if(val == 7){
        gms = '初中'
        return gms
      }
      if(val == 8){
        gms = '小学'
        return gms
      }
      if(val == 9){
        gms = '文盲或半文盲'
        return gms
      }
      if(val == 10){
        gms = '不详'
        return gms
      }
      if(val == 11){
        gms = '硕士'
        return gms
      }
      if(val == 12){
        gms = '博士'
        return gms
      }
    },
    duty(val){
      var gms = ''
      if(val == 1){
        gms = '国家机关、党群组织、企业、事业单位责任人'
        return gms
      }
      if(val == 2){
        gms = '专业技术人员'
        return gms
      }
      if(val == 3){
        gms = '办事人员和有关人员'
        return gms
      }
      if(val == 4){
        gms = '商业、服务业人员'
        return gms
      }
      if(val == 5){
        gms = '生产、运输设备操作人员及有关人员'
        return gms
      }
      if(val == 6){
        gms = '军人'
        return gms
      }
      if(val == 7){
        gms = '不便分类的其他从业人员'
        return gms
      }
      if(val == 8){
        gms = '无职业'
        return gms
      }
    },
    maritalStatus(val){
      var gms = ''
      if(val == 1){
        gms = '未婚'
        return gms
      }
      if(val == 2){
        gms = '已婚'
        return gms
      }
      if(val == 3){
        gms = '丧偶'
        return gms
      }
      if(val == 4){
        gms = '离婚'
        return gms
      }
      if(val == 5){
        gms = '未说明的婚姻情况'
        return gms
      }
    },
    payType(val){
      // var gms = ''
      // if(val == 1){
      //   gms = '未婚'
      //   return gms
      // }
      // if(val == 2){
      //   gms = '已婚'
      //   return gms
      // }
      // if(val == 3){
      //   gms = '丧偶'
      //   return gms
      // }
      // if(val == 4){
      //   gms = '离婚'
      //   return gms
      // }
      // if(val == 5){
      //   gms = '未说明的婚姻情况'
        return val
      // }
    },
  },
};
</script>
  
  <style scoped lang="scss">
.grjbxx {
  .top {
    padding: 10px 20px;
    background-color: #e6f7ff;
    border: 1px solid #91d5ff;
  }
  .tab1 {
    tr {
      width: 100%;
      th {
        text-align: center;
        color: #000;
        background-color: rgb(250, 250, 250);
      }
      td {
        padding: 10px;
      }
    }
  }
  .box {
    padding: 10px 250px;
    background-color: rgb(250, 250, 250);
    margin: 10px 0;
  }
  .tab_sty {
    border-collapse: collapse;
    th {
      display: inline-block;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      -o-text-overflow: ellipsis;
      width: 15%;
      height: 48px;
      line-height: 24px;
      padding: 10px;
      background-color: #fafafa;
      border: 1px solid rgb(217, 217, 217);
    }
    td {
      display: inline-block;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      -o-text-overflow: ellipsis;
      width: 35%;
      height: 48px;
      line-height: 24px;
      padding: 10px;
      border: 1px solid rgb(217, 217, 217);
      text-align: left;
    }
    .no_bd {
      display: inline-block;
      padding: 0px 6px;
      margin: 0 3px;
    }
    .yes_bd {
      display: inline-block;
      padding: 0px 6px;
      margin: 0 3px;
      border: 1px solid #000;
    }
  }
  .tab_sty_33 {
    border-collapse: collapse;
    th {
      display: inline-block;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      -o-text-overflow: ellipsis;
      width: 13%;
      height: 48px;
      line-height: 24px;
      padding: 10px;
      background-color: #fafafa;
      border: 1px solid rgb(217, 217, 217);
    }
    td {
      display: inline-block;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      -o-text-overflow: ellipsis;
      width: 20%;
      height: 48px;
      line-height: 24px;
      padding: 10px;
      border: 1px solid rgb(217, 217, 217);
      text-align: left;
    }
    .no_bd {
      display: inline-block;
      padding: 0px 6px;
      margin: 0 3px;
    }
    .yes_bd {
      display: inline-block;
      padding: 0px 6px;
      margin: 0 3px;
      border: 1px solid #000;
    }
  }
  .no_bdb {
    td {
      border-bottom: none;
    }
  }
}
</style>